<script setup lang="ts">
import SystemLogo from '@/components/common/logo.vue'

defineOptions({
  name: 'GlobalLogo'
})

interface Props {
  title: string
  isShow: boolean
}
const props = withDefaults(defineProps<Props>(), {
  title: '管理系统',
  isShow: true
})
</script>

<template>
  <RouterLink
    to="/manage"
    style="display: flex; justify-content: center; align-items: center; width: 100%; height: 56px"
  >
    <SystemLogo />
    <h2 class="title" v-if="isShow">{{ title }}</h2>
  </RouterLink>
</template>

<style scoped>
.title {
  white-space: nowrap; /* 防止内容换行 */
  overflow: hidden; /* 隐藏超出的内容 */
  text-overflow: ellipsis; /* 当内容超出时，用省略号表示 */
  max-width: 100%; /* 限制宽度，配合overflow隐藏多余内容 */
}
</style>
